<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.2.1.min.js"></script>
    <script src="jquery.query.js"></script>
    <script>
        //得到主贴ID
       let pid = $.query.get("primaryId");

       $(function () {
           $("#primaryId").val(pid);

          findPrimary();
       });
       //查询主贴
       function findPrimary() {
           $.post("/primaryPost/findById","id="+pid,function (primaryObj) {
               //主贴信息填充
               $("#titleSpan").html(primaryObj.title);
               $("#createDateSpan").html(primaryObj.createDate);
               $("#authTd").html(primaryObj.user.name);
               $("#contentTd").html(primaryObj.content);

               //回贴信息填充
               let str = "";
               for(var i=0;i<primaryObj.replyList.length;i++){
                   var obj = primaryObj.replyList[i];
                   str += `<tr><td>${obj.user.name}</td><td>${obj.createDate}</td><td>${obj.content}</td></tr>`;
               }
               $("#replyData").html(str);
           });
       }

       //回贴
       function addReply() {
           $.post("/reply/add",$("#f1").serialize(),function (info) {
              if(info == 'ok'){
                  findPrimary();
              }
              else{
                  alert("访问服务器异常");
              }
           });
       }
    </script>
</head>
<body>
    <table border="1" width="60%">
        <tr><th>发贴人</th><th>主题：<span id="titleSpan"></span> 发贴时间：<span id="createDateSpan"></span></th></tr>
        <tr>
            <td id="authTd"></td><td id="contentTd"></td>
        </tr>
    </table>
    <hr>
    <table border="1" width="50%">
        <thead>
            <tr><th>回贴人</th><th>回贴时间</th><th>内容</th></tr>
        </thead>
        <tbody id="replyData"></tbody>
    </table>

    回贴：
    <form id="f1">
        <input type="hidden" name="primaryId" id="primaryId">
        内容：<textarea name="content"></textarea><br>
        <input type="button" value="回贴" onclick="addReply()">
    </form>
</body>
</html>